Skip to main content

SourceLinks

In order for components to interact within your web app, data exchange is necessary. We provide two methods for achieving this:

UI Snippets:
These allow you to react to events based on JavaScript.

SourceLinks:
For simple use cases, data exchange can occur via SourceLinks. Here, as a user, you only need to specify a data source and its event in the data receiver component. The data will automatically be processed in the receiver component when the specified event is triggered.

Many use cases only require SourceLinks. Let me demonstrate how SourceLinks can be utilized in yeet.

Topbar

Functionality

There are two types of components:

Sender Components: These components send their data to an event bus upon triggering an event.

Receiver Components: They configure themselves to listen for a specific event from a sender component and automatically react to the triggered event of the sender component.

Topbar

Our components can also act as both sender and receiver components. Additionally, a component can respond to multiple events from various senders.

Topbar

Configuring Receiver Components

To enable a receiver component to respond to SourceLinks events, you need to configure the sender component. Begin by selecting a component in the UI designer. Once the component is selected, you can configure SourceLinks via the Toolbar.

You can also find additional SourceLinks options in the Detail Panel under the "Links" category. Here, all available SourceLinks for the component are displayed. Clicking on a SourceLink allows you to configure the receiver component using the SourceLink Picker.

Sender Components

You can discover which events are triggerable via SourceLinks using the SourceLink Picker. When configuring a component, you can determine the events it offers. Additionally, through the event functions, you can control whether a SourceLink event should be triggered.

Clipboard

An important feature is the Clipboard, a component designed solely for data transfer. Here, you can fill Clipboard properties with new values via SourceLinks or directly incorporate new values into components via SourceLinks.

Usage

Here are the main use cases for SourceLinks:

Forms

You can easily populate a Clipboard via a Row Select event in the table using a SourceLink. Then, it's straightforward to fill the data of the row in a form on a popup or another page using SourceLinks from the Clipboard. Each component in a form retrieves the initial value from the Clipboard and also writes changes back to the Clipboard via SourceLinks.

Topbar

Text Modules

The label can utilize SourceLink event data as variables through template strings. This allows you to insert simple text modules into your application.

Topbar

Expressions

The filter in the table can also be populated via SourceLinks. Here, template strings are supported, allowing you to easily build dynamic filters.

Topbar

Examples

Some code examples can be found under:

  • yLabel:
    Creating a template string using the yInput SourceLink event. Loading table data via a yTable SourceLink event.
  • Clipboards:
    Loading data from a table into a clipboard.